<template>
  <div id="he-plugin-simple" />
</template>

<script setup>
import {
  onMounted,
} from "vue";

onMounted(() => {
  const scriptEl1 = document.createElement("script");
  const scriptEl2 = document.createElement("script");
  scriptEl1.innerHTML = `
    WIDGET = {
      "CONFIG": {
        "modules": "01234",
        "background": "5",
        "tmpColor": "C1C5C6",
        "tmpSize": "16",
        "cityColor": "C1C5C6",
        "citySize": "16",
        "aqiColor": "C1C5C6",
        "aqiSize": "16",
        "weatherIconSize": "24",
        "alertIconSize": "18",
        "padding": "0px 0px 0px 0px",
        "shadow": "0",
        "language": "auto",
        "fixed": "false",
        "vertical": "center",
        "horizontal": "left",
        "key": "621c7f870c8c437fa080c669cc563db0",
      },
    };
  `;
  scriptEl2.src = "https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0";
  document.body.appendChild(scriptEl1);
  document.body.appendChild(scriptEl2);
});
</script>

<style lang="less" scoped>
  @import "./index.less";
</style>
